<template>
  <div  class="tw-shadow-2xl tw-rounded-3xl tw-w-2/3 tw-m-auto tw-border-2" style="height: 80vh;margin-top: 10px">
    <div class="tw-flex tw-justify-center tw-m-10 tw-text-7xl">
      {{time}}
    </div>
    <div class="tw-justify-center tw-flex tw-text-4xl">
      <div class="tw-flex-col">
        欢迎你，{{userStore.name}}
      <br>
      <div class="tw-m-10">
      <img :src="userStore.avatar" class="tw-rounded-3xl"/>
      </div>
      </div>

    </div>
  </div>
</template>
<script setup name="Index">
import {ref} from 'vue'
import useUserStore from '@/store/modules/user.js'

const userStore = useUserStore()

const time = ref('')
function check(val){
  if(val < 10){
    return("0" + val)
  }else{
    return(val)
  }
}
const refreshTime = setInterval(()=>{
  var a = new Date();
  var b = a.getHours();
  var c = a.getMinutes();
  var d = a.getSeconds();
  time.value = check(b)+":"+check(c)+":"+check(d);


})

</script>

<style scoped>

</style>

